<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <video
      src="./videos/chrome_japan.mp4"
      controls
      muted
      loop
      poster="./images/1.jpg"
      preload="auto"
    >
      您的浏览器不支持视频播放，请更换或者升级浏览器
    </video>

    <audio src="./videos/100回.mp3" controls autoplay loop></audio>
  </body>
</html>

<!-- 
  视频标签和音频标签是h5版本新增的媒体标签

  视频标签
    <video></video>

    src属性表示的也是视频的路径(绝对路径或者相对路径)
    controls属性可以有一些控件(播放按钮/全屏等按钮)
    autoplay属性表示自动播放(必须要配合muted才能自动播放，隐私相关问题)
    muted属性表示静音播放
    poster表示的是没有自动播放的封面图片
    preload="auto"表示预备加载
    loop属性表示循环播放


  音频标签
    <audio></audio>

    src属性表示的也是音频的路径(绝对路径或者相对路径)
    除了poster没有以外，其他属性和视频一样
 -->
